<template>
<div class="e3d">
  <div class="head" v-if="token">{{name}}</div>
  <div class="frame-view" v-if="token"></div>
  <div class="no-data-tip" v-else>BIM系统正在维护中</div>
  <div class="dbtn">
    <!-- <span class="btn btn-b"><img src="../../../assets/icon/down.png" alt="">下载模型</span> -->
  </div>
</div>
</template>
<script>
export default {
  name: 'association',
  data () {
    return {
      id: '',
      token: '',
      name: '',
      viewer3D: '',
      app: '',
      list: [{
        id: 1,
        title: '[国务院 应急管理部]关于开展2020年全国“安全生产月”和“安全生产万里行”活动的通知'
      }, {
        id: 2,
        title: '关于印发《住房和城乡建设部工程质量安全监管司2020年工作要点》的通知'
      }, {
        id: 3,
        title: '国务院转发住房城乡建设部关于完善质量保障体系提升建筑工程品质指导意见的通知'
      }]
    }
  },
  watch: {
    $route (to, from) {
      this.init()
    }
  },
  components: {
  },
  created () {
    this.init()
  },
  computed: {
  },
  methods: {
    init () {
      this.id = this.$route.params.id
      this.name = this.$route.query.name
      this.queryViewToken()
    },
    queryViewToken () {
      this.$http.queryViewToken({}, this.id).then(res => {
        if (this.app) {
          this.app.destroy(this.token)
        }
        if (res.data && res.data.viewToken) {
          this.token = res.data.viewToken
          this.onLoad()
        } else {
          console.log('222')
        }
      })
    },
    onLoad () {
      var loaderConfig = new BimfaceSDKLoaderConfig();
      loaderConfig.viewToken = this.token;
      // loaderConfig.viewToken = '568b593c6e2943fab6a696677c5f87a8'
      BimfaceSDKLoader.load(loaderConfig, this.successCallback, this.failureCallback);
    },
    successCallback (viewMetaData) {
      let _this = this
      var dom4Show = document.querySelector('.frame-view')
      var webAppConfig = new Glodon.Bimface.Application.WebApplication3DConfig()
      webAppConfig.domElement = dom4Show;
      webAppConfig.Toolbars = ['MainToolbar'];
      this.app = new Glodon.Bimface.Application.WebApplication3D(webAppConfig)
      _this.viewer3D = _this.app.getViewer()
      window.onresize = function () {
        _this.viewer3D.resize(document.documentElement.clientWidth, document.documentElement.clientHeight - 40);
      }
      _this.viewer3D.addEventListener(Glodon.Bimface.Viewer.Viewer3DEvent.ViewAdded, () => {
        _this.viewer3D.render();
      })
      this.app.addView(this.token)
    },
    failureCallback (err) {
      console.log('error', err)
    },
  }
}
</script>
<style lang="scss">
.no-data-tip{
  width: 100%;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8e8282;
  font-size: 22px;
}
</style>
